<template>
	<div id="Nav">
		<el-menu
			mode="vertical"
			:show-timeout="200"
			:default-active="$route.path"
			:collapse="isCollapse"
			background-color="#304156"
			text-color="#bfcbd9"
			active-text-color="#409EFF"
		>
			<sidebar-item :routes="routes"></sidebar-item>
		</el-menu>
	</div>
</template>

<script>
import SidebarItem from './child/SidebarItem'
export default {
	name: 'Nav',
	data() {
		return {}
	},
	computed: {
		routes() {
			return this.$store.state.permission.routers
		},
		isCollapse() {
			return false
		},
	},
	methods: {},
	mounted() {},
	components: {
		SidebarItem,
	},
}
</script>

<style scoped lang="less">
/deep/ .el-menu {
	border-right-width: 0 !important;
}
/deep/.el-menu-item {
	min-width: 140px;
}
</style>
